<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>koa2-blog</title>
	<link rel="icon" href="http://www.wclimb.site/images/avatar.png">
	<link rel="stylesheet" href="/index.css">
	<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.min.js"></script>
	<script>
		function fade(txt){
			$('.message').text(txt)
			$('.message').animate({
				top:0
			})
			setTimeout(function(){
				$('.message').animate({
					top: '-100%'
				})
			},1500)
		}
		$(function(){
			$('.signout').click(function(){
				$.ajax({
					url: "/signout",
					type: "GET",
					cache: false,
					dataType: 'json',
					success: function (msg) {
						if (msg) {
							fade('登出成功')
							setTimeout(function(){
								location.href = "/posts"
							},1500)	
						}
					},
					error: function () {
						alert('异常');
					}
				})
			})
		})
	</script>
</head>
<body>
	<header>
		<div class="user_name">
			<% if(session.user){ %>
				 Hello,<%= session.user %>
			<% } %>
			<% if(!session.user){ %>
				欢迎注册登录^_^
			<% } %>
		</div>
		<div class="message">登录成功</div>
		<div class="user_right">
			<%  if(session.user){ %>
				<div class="has_user">
					<a target="__blank" href="https://github.com/wclimb/Koa2-blog">GitHub</a>
					<% if(type == 'all'){ %>
						<a class="active" href="/posts">全部文章</a>
					<% }else{ %>
						<a href="/posts">全部文章</a>
					<% }%>
					<% if(type == 'my'){ %>
						<a class="active" href="/posts?author=<%= session.user %>">我的文章</a>
					<% }else{ %>
						<a href="/posts?author=<%= session.user %>">我的文章</a>
					<% }%>
					<% if(type == 'create'){ %>
						<a class="active" href="/create">发表文章</a>
					<% }else{ %>
						<a href="/create">发表文章</a>
					<% }%>
					
					<span class="signout">登出</span>
				</div>
			<% } %>
			<% if(!session.user){ %>
				<div class="none_user has_user">
					<a target="__blank" href="https://github.com/wclimb/Koa2-blog">GitHub</a>
					<% if(type == 'all'){ %>
						<a class="active" href="/posts">全部文章</a>
					<% }else{ %>
						<a href="/posts">全部文章</a>
					<% }%>
					<% if(type == 'signup'){ %>
						<a class="active" href="/signup">注册</a>
					<% }else{ %>
						<a href="/signup">注册</a>
					<% }%>
					<% if(type == 'signin'){ %>
						<a class="active" href="/signin">登录</a>
					<% }else{ %>
						<a href="/signin">登录</a>
					<% }%>
				</div>
			<% } %>
		</div>
	</header>